<!-- 表格数据 -->
<template>
  <el-table :data="tableData" style="width: 100%">
    <el-table-column type="expand">
      <template slot-scope="scope">
        <el-form label-position="left" inline class="demo-table-expand">
          <el-form-item label="用户名称：">
            <span>{{ scope.row.username }}</span>
          </el-form-item>
          <el-form-item label="真实姓名：">
            <span v-if="!scope.row.real_name">暂无</span>
            <span v-else>{{ scope.row.real_name }}</span>
          </el-form-item>
          <el-form-item label="性别：">
            <span v-if="scope.row.gender === 'UNKNOWN'">保密</span>
            <span v-else-if="scope.row.gender === 'MALE'">男</span>
            <span v-else>女</span>
          </el-form-item>
          <el-form-item label="年龄：">
            <span v-if="!scope.row.age">暂无</span>
            <span v-else>{{ scope.row.age }}</span>
          </el-form-item>
          <el-form-item label="所在单位：">
            <span v-if="!scope.row.common_name">暂无</span>
            <span v-else>{{ scope.row.common_name }}</span>
          </el-form-item>
          <el-form-item label="学院名：" v-if="scope.row.common_name == 'USER'">
            <span v-if="!scope.row.class_name"></span>
            <span v-else>{{ scope.row.class_name }}</span>
          </el-form-item>
          <el-form-item label="班级：" v-if="scope.row.common_name == 'USER'">
            <span v-if="!scope.row.description">暂无</span>
            <span v-else>{{ scope.row.description }}</span>
          </el-form-item>
          <el-form-item label="自我介绍：">
            <span v-if="!scope.row.description">暂无</span>
            <span v-else>{{ scope.row.description }}</span>
          </el-form-item>
          <el-form-item label="电话号码：">
            <span v-if="!scope.row.phone_number">暂无</span>
            <span v-else>{{ scope.row.phone_number }}</span>
          </el-form-item>
          <el-form-item label="QQ号码：">
            <span v-if="!scope.row.qq_number">暂无</span>
            <span v-else>{{ scope.row.qq_number }}</span>
          </el-form-item>
          <el-form-item label="微信号码：">
            <span v-if="!scope.row.wechat_number">暂无</span>
            <span v-else>{{ scope.row.wechat_number }}</span>
          </el-form-item>
          <el-form-item label="电子邮箱：">
            <span v-if="!scope.row.email">暂无</span>
            <span v-else>{{ scope.row.email }}</span>
          </el-form-item>
          <el-form-item label="身份：">
            <span v-if="scope.row.authority == 'USER'">求职者</span>
            <span v-else-if="scope.row.authority == 'MERCHANT'">商户</span>
            <span v-else>管理员</span>
          </el-form-item>
          <el-form-item label="登录方式：">
            <span v-if="!scope.row.login_type">该用户无登录信息</span>
            <span v-else-if="!scope.row.login_type == 'LOCAL'">本地</span>
            <span v-else>Github</span>
          </el-form-item>
          <el-form-item label="注册时间：">
            <span>{{ scope.row.register_time }}</span>
          </el-form-item>
          <el-form-item label="上次登录时间：">
            <span v-if="!scope.row.last_login_date">该用户无登录信息</span>
            <span v-else>{{ scope.row.last_login_date }}</span>
          </el-form-item>
        </el-form>
      </template>
    </el-table-column>
    <el-table-column prop="username" label="用户名" min-width="120">
    </el-table-column>
    <el-table-column prop="phone_number" label="电话号码" min-width="130">
    </el-table-column>
    <el-table-column label="电子邮箱" min-width="190">
      <template slot-scope="scope">
        <span v-if="!scope.row.email">暂无</span>
        <span v-else>{{ scope.row.email }}</span>
      </template>
    </el-table-column>
    <el-table-column label="身份" min-width="100">
      <template slot-scope="scope">
        <span v-if="scope.row.authority == 'USER'">求职者</span>
        <span v-else-if="scope.row.authority == 'MERCHANT'">商家</span>
        <span v-else>管理员</span>
      </template>
    </el-table-column>
    <el-table-column label="所在单位" min-width="200">
      <template slot-scope="scope">
        <span v-if="!scope.row.common_name">暂无</span>
        <span v-else>{{ scope.row.common_name }}</span>
      </template>
    </el-table-column>
    <el-table-column label="操作" min-width="150">
      <!-- eslint-disable-next-line -->
      <template slot-scope="scope">
        <el-row>
          <el-button type="text" @click="gain_User(scope.row.id,visible)"
            ><i class="el-icon-edit"></i><span>修改</span></el-button
          >
          <el-button
            type="text"
            @click="delUser(scope.row.id, scope.row.username)"
            ><i class="el-icon-delete"></i><span>删除</span></el-button
          >
          <!-- <el-dropdown>
              <span class="el-dropdown-link">
                <i class="el-icon-d-arrow-right el-icon--right"></i>更多
              </span>
              <el-dropdown-menu slot="dropdown">
                <el-dropdown-item><i class="el-icon-key"></i>重置密码</el-dropdown-item>
                <el-dropdown-item>狮子头</el-dropdown-item>
                <el-dropdown-item>螺蛳粉</el-dropdown-item>
              </el-dropdown-menu>
            </el-dropdown> -->
        </el-row>
      </template>
    </el-table-column>
  </el-table>
</template>

<script>
import { mapState, mapActions } from "vuex";
import { delUser, gain_User, refreshData } from "@/assets/js/adminPerson.js";
export default {
  props:{
    visible: Boolean,
  },
  data() {
    return {

    };
  },
  methods: {
    ...mapActions("admin", ["deleteUser", "gainUser","changePage"]),
    delUser,
    gain_User,
    refreshData,
  },
  computed: {
    ...mapState("admin", ["tableData"]),
  },
};
</script>

<style lang='scss' scoped>
</style>
